<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name = "viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>Home</title>
    <link rel="stylesheet" href="font_awesome/css/font-awesome.css">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/index.css">
</head>
<body>
    <div class="wrap">
        <!--“简单版”布局-->
        <div class="card pointer">
            <div class="card-top">简&nbsp;单&nbsp;版</div>

            <div class="card-content flex-center">
                <img class="blue-wolf-img" src="image/blue1.png" alt="wolf">

                <button class="f-btn start" id="start">
                    <span>开始&nbsp;</span>

                    <i class="fa fa-arrow-right" aria-hidden="true"></i>
                </button>
            </div>
        </div>

        <!--“复杂版”布局-->
        <div class="card">
            <div class="card-top">复&nbsp;杂&nbsp;版</div>

            <div class="card-content flex-center card2 ">
                <img class="wolf-img" src="image/game2.png" alt="wolf">
            </div>
        </div>
    </div>
    <script src="jQuery/jquery-3.2.1.js"></script>
    <script>
        $(document).ready(function () {
            $("#start").click(function () {
                location.href = "html/match.html";
            });
        })
    </script>
</body>
</html>